cc-pocket · mobile ui 2.1 · settings + bridges · direction · corrected

Settings + Bridges Direction v1

Two bounded problems, one visual language inherited from Supporting Surfaces Master v1: restore scan hierarchy on the Settings landing, and stop the bridge card from stacking 编 over 辑 at narrow Chinese width. Directions A3 and C2 stand; every frame, note and rule now uses the repository's own copy and the real BridgeInfo model. Link state and runner state are two independent facts here, as they are in the product.

2 problems
A3 + C2 selected
2 + 5
utilities + categories
320 – 402 pt
100% / 200% text
Corrected · repository copy

Chinese titles are the existing ones: Token 用量, 定时任务, 通用, Agent 与会话默认项, 连接与协作, 安全与审批, 帮助与关于. Invented subtitles — trusted contacts, passcode, diagnostics — are gone; where a category's existing scope string is not in hand, the subtitle is simply absent rather than guessed.

Corrected · one identity field

BridgeInfo carries one display identity: name. The invented friendly-label-plus-id pair is removed, deviceId is never printed, and the AccessTier badge — a security-relevant existing field dropped by mistake — is back on every collapsed card.

Corrected · two independent facts

Link state is pendingTicket, then online, then offline, in the product's own words. runner.running only chooses which runner actions exist; Running, Stopped and Pending no longer masquerade as link labels. With runner == null there are no runner controls at all, Edit included.

Corrected · tags, paths, recovery

The noApproval tag reads “trust modes allowed / 可设信任模式” and means configuration is permitted, not that approvals are skipped. Workdirs print as basenames. Revoke is a visible action on every card, never inside the disclosure. bridgeError and bridgeMergeLost print above the cards with no Retry and no log action.

A

Settings landing · three candidate hierarchies

Same seven destinations every time. Only the hierarchy between them changes.

The flat list fails for one reason: seven equal rows with seven static scope subtitles give the eye no place to land, so the two things people came for — usage and schedule — read as the first two of seven categories. Live: tap the tabs to switch, tap any row to see it register.

{{ o.label }}
last tap · {{ lastTap }}
A1 · flat list · production today
Settings
Connected to Panda · MacBook Pro
Token usage
This computer
Scheduled tasks
Recurring prompts
General
Appearance, text size, notifications
Agent & session defaults
Agent, model, permission mode
Connections & collaboration
Computers, shared folders, collaborators, bridges
Security & approvals
Support & about
Rejected. Seven identical rows, one weight. The two utilities are indistinguishable from the five categories, and the subtitles compete with the titles instead of supporting them. This is the state we are fixing.
A2 · utility tiles + category list
Settings
Connected to Panda · MacBook Pro
Token usage
Scheduled tasks
General
Agent & session defaults
Connections & collaboration{{ pending }}
Security & approvals
Support & about
Rejected. The separation works, but two containers of dashboard-shaped tiles are exactly the nested-card chrome UI 2.0 forbids, and an empty tile invites a figure the product cannot supply here. At 200% the pair breaks to one column and the page loses its top third to two words.
A3 · labelled groups · selected
Settings
Connected to Panda · MacBook Pro
Token usage
Scheduled tasks
Categories
General
Dark · Default text size
Agent & session defaults
Agent, model, permission mode
Connections & collaboration
Computers, shared folders, collaborators, bridges
{{ pending }}
Security & approvals
Support & about
Selected. Two utilities sit on the paper base as bare title rows directly under the existing summary. The five categories sit inside one low container under a written Categories label. A subtitle appears only where the product already has the words for one — General reads real local state; the last two rows carry no subtitle at all rather than an invented list.
Why A3 and not A2

A2 buys separation with a second container type. A3 buys the same separation with contrast the surface already owns — paper versus low container, subtitle versus no subtitle, one group label. It survives 200% text and Chinese without re-flowing, because nothing sits side by side.

Which subtitles are allowed

General prints real resolved local state — appearance and text size. Agent and Connections print scope copy taken from the settings they already contain. Security & approvals and Support & about print none until their existing scope strings are pulled from the repository; a subtitle is never authored on this board. Utilities print none by rule.

What stays exactly as it is

Large title, the existing Connected to <computer> summary derived from paired.displayName with no link health or counts, the two utilities, the five categories in order, and the pending-review badge beside Connections above zero.

B

Settings · layout proofs

Full device boxes with the header behaviour and the scroll clip in place.
01 · dark · EN · 402 × 874
9:41▲ ▮
Projects
Settings
Connected to Panda · MacBook Pro
Token usage
Scheduled tasks
Categories
General
Dark · Default text size
Agent & session defaults
Agent, model, permission mode
Connections & collaboration
Computers, shared folders, collaborators, bridges
{{ pending }}
Security & approvals
Support & about
All seven destinations fit above the fold at default size. Utilities are hairline-bounded on paper; categories are one container. Rows without a subtitle relax to 56 pt, those with one hold 64 — both above the 44 pt floor.
02 · light · 简体中文 · 390 × 844
9:41▲ ▮
项目
设置
已连接 Panda · MacBook Pro
Token 用量
定时任务
分类
通用
浅色 · 默认字号
Agent 与会话默认项
Agent · 模型 · 权限模式
连接与协作
电脑 · 共享文件夹 · 协作者 · 桥接
{{ pending }}
安全与审批
帮助与关于
The repository's own titles, latin words included: Token 用量, 定时任务, Agent 与会话默认项. Chinese is shorter, so the group label carries more of the hierarchy. Computer names stay literal; the 通用 line reads real local state in Chinese.
03 · dark · EN · text 200% · fifth category below the fold
9:41▲ ▮
Projects
Settings
Connected to Panda · MacBook Pro
Token usage
Scheduled tasks
Categories
General
Dark · Default text size
Agent & session defaults
Agent, model, permission mode
Connections & collaboration
Computers, shared folders, collaborators, bridges
{{ pending }}
Security & approvals
Support & about
The list scrolls under a held header, so Support & about sits below the fold rather than being shortened — scroll the frame to reach it. Rows grow to 72 – 88 pt, labels wrap, the badge grows with the text, and nothing truncates or shrinks.
C

Bridge card · two candidate zonings

Both shown at the 320 pt stress width, where the break actually happens.

Today name, link state, access tier, the trust tag and the runner actions share one row. At 320 pt minus a 20 pt gutter there are 280 pt of content, and the last flex child is squeezed until 编辑 breaks between its two characters. A button that wraps its own label is the failure; a button row that wraps as whole buttons is the fix.

C0 · today · 320 pt · the bug
研发适配器
● 在线 可设信任模式
重启
停止
编辑
Reproduced honestly: one row, competing children, 编 over 辑 in the last one, and the access tier squeezed out of the row entirely. Link state and trust also compete with the actions for the same horizontal space, so the card has no reading order at all.
C1 · actions into an overflow menu
研发适配器
● 在线 full 可设信任模式
···
Rejected. It fixes the wrap and the card becomes calm. But Restart and Stop are the reason this screen is opened when an adapter misbehaves, and burying them behind an unlabelled glyph costs a tap and all discoverability. It also hides whether a bridge has a managed runner at all, and Revoke — a destructive action that must stay visible — would go with them.
C2 · three stacked zones · selected
研发适配器
● 在线 full 可设信任模式 2 个进行中
重启
停止
编辑
撤销
Selected. Name, then link state with access tier and trust, then actions below a hairline. Four controls at 96 pt minimum plus 8 pt gaps cannot share 280 pt, so the row wraps two by two — every label single-line at 48 pt, 编辑 horizontal, Revoke visible.
Exact responsive rule

Action row: flex; wrap; gap 8. Each control flex 1 1 auto; min-width 96; min-height 48; padding 0 16; white-space nowrap. No min-width 0 and no word-break inside a control, so the row breaks before a label can.

Zone contract

Zone 1: name, once, monospace — no second identity line and never deviceId. Zone 2: link state beside its mark, the AccessTier badge, the optional trust tag, the live-session count — one wrapping run, no controls. Zone 3: actions below a hairline.

Targets

48 pt on every runner action, Revoke and every sheet button; 44 pt floor on the disclosure control and the card. At 200% controls grow to 60 pt and the row wraps further. Targets never shrink to make a row fit.

Localisation

96 pt holds two-character Chinese labels and the longest English equivalent (Restart) at both text sizes. Only fixed grammar localises; name, workdir basenames, exit codes and error text are data and print as supplied.

D

Bridges · variant proofs

Live: the chevron expands each card on its own, and Revoke opens the existing sheet.
04 · 简体中文 · 390 × 844 · 在线 + runner.running
9:41▲ ▮
连接与协作
机器人桥接
已连接 Panda · MacBook Pro
研发适配器
● 在线 full 可设信任模式 2 个进行中
重启
停止
编辑
撤销
{{ caret.a }}
项目
cc-pocket · pocket-nightly
日志
adapter connected
session 2 attached
design-review-bot
◐ 等待适配器连接 limited
启动
编辑
撤销
ci-adapter
○ 离线 full
撤销
{{ caret.d }}
项目
pocket-nightly
此桥接由你自行运行适配器。
撤销此桥接?
该桥接将失去访问权限。此操作无法撤消。
取消
撤销
Three link states in the product's own words — 在线, 等待适配器连接, 离线 — none of them derived from the runner. Card one is a running managed runner (重启 · 停止 · 编辑 · 撤销, wrapping 3 + 1 at 350 pt of content); card two is stopped (启动 · 编辑 · 撤销); card three has no runner, so Revoke is the only control and the expansion carries just the existing self-run sentence. AccessTier prints on every card.
05 · 320 pt · whole buttons wrap
9:41▲ ▮
连接与协作
机器人桥接
研发适配器
● 在线 full 可设信任模式 2 个进行中
重启
停止
编辑
撤销
ci-adapter
○ 离线 full
启动
编辑
撤销
280 pt of content: the running card wraps two by two, the stopped card two then one. 编辑 stays horizontal in both, every control holds 48 pt, and no row scrolls sideways or shrinks a label.
06 · 402 pt · text 200% · one control per line
9:41▲ ▮
连接与协作
机器人桥接
研发适配器
● 在线 full 可设信任模式 2 个进行中
重启
停止
编辑
撤销
{{ caret.b }}
项目
cc-pocket · pocket-nightly
At 200% the minimum widens to 150 pt and targets to 60, so the four controls wrap two by two. Link state, tier, trust tag and live count wrap as a run of whole phrases. The disclosure control grows to 56 pt.
07 · light · EN · stopped · unmanaged · expanded
9:41▲ ▮
Connections
Bridges
Connected to Panda · MacBook Pro
research-adapter
● Online full 1 live
Start
Edit
Revoke
{{ caret.e }}
Projects
cc-pocket · pocket-nightly
Exit code
1
Last error
connect ECONNREFUSED 127.0.0.1:8787
Log
runner exited (1)
retry scheduled
ops-bot
● Online limited 2 live
Revoke
{{ caret.f }}
Projects
cc-pocket
You run this adapter yourself
ci-adapter
◐ Waiting for the adapter to connect full trust modes allowed
Restart
Stop
Edit
Revoke
Edit bridge
Nameci-adapter
Projectscc-pocket · pocket-nightly
Cancel
Save
Revoke this bridge?
This bridge will lose access. This cannot be undone.
Cancel
Revoke
Card one: online link, stopped runner — Start, Edit, Revoke — expanded with projects, exit code, last error and log tail. Card two: online link, no runner — Revoke only, and the expansion holds nothing but the existing self-run sentence. Card three: pendingTicket with a running runner, proving the two facts are independent. Edit and Revoke open their existing sheets.
08 · empty · unavailable · error banner · merge-loss banner
机器人桥接
{{ e.body }}
研发适配器
● 在线 full
{{ e.tag }}
Empty and unavailable are sentences with no action. bridgeError prints verbatim above the list and bridgeMergeLost prints its localized warning above the list — both leave whatever cards did arrive visible beneath them, and neither offers Retry or a log. The empty and unavailable strings on this board are placeholders to be replaced with the repository's exact copy in the master.
E

Rules to implement against

Rule
Definition
{{ r.k }}
{{ r.v }}

Boundaries

{{ b.n }}{{ b.t }}
Not claimed anywhere
usage periods, figures or limits
category counts or update status
deviceId · absolute paths · link health
runner state dressed as link state
approvals skipped · recovery advice
To confirm against the repository

Three items are placeholders on this board and must be pulled verbatim before the master: the empty and unavailable strings, the localized bridgeMergeLost warning, and the AccessTier enum values (shown here as full / limited). Scope subtitles for Security & approvals and Support & about are deliberately absent for the same reason.

Next step, not taken here

This board is the direction only. The master prototype — one live device component driving Settings, the five categories and Bridges with theme, locale, text size and bridge fixtures as runtime state — comes next, on approval of A3 and C2.